var batterie = {};
var lastSel;
var lastRowId = 0;
var serieNames = {};

/**
 * initialization
 */
$(document).ready(function(){
	// fill options (selects)
	$('.container.batterieForm .numList').append(
		$('<option />').attr('value', 0).html('illimité')
	)
	for (var i=1; i<=100; i++) {
		$('.container.batterieForm .numList').append(
			$('<option />').attr('value', i).html(i)
		);
	}

	// bind actions
	$('.batterieForm form.cvsForm').attr('action', serverPath + '/exercice/post/');
	
	$('.batterieForm form.newExercice').bind('submit', postNewExercice);

	$('.batterieForm form#mainData').bind('submit', saveMainData);

	$('form.modifyImage').attr('action', serverPath + '/exercice/image/');
	$('#modifyImageFile').bind('change', sendModifiedImage);
	
	$('form.modifyAudio').attr('action', serverPath + '/exercice/audio/');
	$('#modifyAudioFile').bind('change', sendModifiedAudio);
});

/**
 * Go to batterie management form
 */
function displayBatterieForm(batterieId) {
	hideContainers();
	hideCsvForm();
	// don't back on 'escape' if editing the grid
	backOnEsc = false;
	
	$.ajax({
		type: 'GET',
		url: serverPath + '/batterie/get?id=' + batterieId,
		success: function(data) {
			$('.globalActions .delete').removeClass('hidden');

			//remove old grid if existing
		    $('.container.batterieForm .exercices').html("<table id='exerciceGrid'></table>");
			
			// manage batterie
			batterie = data;
			$('.cvsForm input[name=batterie_id]').val(batterie.id);
			$('.newExercice input[name=batterie_id]').val(batterie.id);
			$('.batterieForm #mainData input[name=batterie_id]').val(batterie.id);
			$('.batterieForm #mainData #nom').val(batterie.nom);
			$('.batterieForm #mainData #description').val(batterie.description);
			$('.batterieForm #mainData #pagePerSerie').val(batterie.page_per_serie);
			$('.batterieForm #mainData #questionPerPage').val(batterie.question_per_page);
			manageCheckbox($('.batterieForm #mainData #numero_enabled'), "1" === batterie.numero_enabled);
			manageCheckbox($('.batterieForm #mainData #dictee_enabled'), "1" === batterie.dictee_enabled);
			manageCheckbox($('.batterieForm #mainData #default_tempo'), "1" === batterie.default_tempo);
			
			// manage batterie management (available only for owner)
			if (batterie.is_owner != '1') {
				$('.batterieForm #mainData input, .batterieForm #mainData select').attr('disabled', 'disabled');
				$('.batterieForm #mainData input.inputButton').addClass('hidden');
				$('.globalActions .delete').addClass('hidden');
			}
			
			// manage types
			$('.batterieForm #mainData #visibility_id option').removeAttr('selected');
			$.each($('.batterieForm #mainData #visibility_id option'), function(idx, viz){
				if (batterie.visibility_id == $(viz).attr('value')) {
					$(viz).attr('selected', 'selected');
				}
			});
			
			// initialize serie names 
			serieNames = batterie.series;
			
			showContainer('batterieForm');
			// load exercices
			fillExercices();
		},
		error: function(data) {
			displayPopup("Vous n'avez pas les droits pour accéder à cette batterie.", "Accès non authorisé", displaySaisie);
		},
		dataType: 'json'
	});
}

function fillExercices(){
	// exercices
    $('#exerciceGrid').jqGrid({
        jsonReader:{repeatitems:false,subgrid:{repeatitems:false}},
        gridview: true,
        loadonce: true,
        rowNum:100,
        autowidth:true,
        height: '100%',
        sortname: 'id',
        rowList:[100,200,300],
        datatype: 'local',
        colNames: ['Id', 'Sup.', 'Série', 'n° Page', 'n° Question', 'Description', 'Question', 'Réponse complète', 'Image', 'Son'],
        colModel:[
            {'name':'id','index':'id','sorttype':'int','key':true,'editable':false, 'hidden':true},
            {'name':'id', 'width': 75, 'index':'id','editable':false, 'formatter':deleteFormatter},
            {'name':'serie','index':'serie','classes':'serieColumn','sorttype':'int','editable':false, 'edittype':'text', 'formatter':serieFormatter, 'unformat': serieUnFormatter},
            {'name':'page','index':'page','sorttype':'int','editable':false, 'edittype':'text'},
            {'name':'question_numero','index':'question_numero','sorttype':'int','editable':false, 'edittype':'text'},
            {'name':'description','index':'description','sorttype':'string','classes':'ui-ellipsis','editable':true, 'edittype':'text'},
            {'name':'question','index':'question','sorttype':'string','classes':'ui-ellipsis','editable':true, 'edittype':'text'},
            {'name':'reponse_complete','index':'reponse_complete','sorttype':'string','classes':'ui-ellipsis','editable':true, 'edittype':'text'},
            {'name':'image_name','index':'image_name','sorttype':'string','classes':'ui-ellipsis imageColumn','editable':false, 'formatter':imageFormatter, 'unformat': imageUnformatter},
            {'name':'sound_name','index':'sound_name','sorttype':'string','classes':'ui-ellipsis audioColumn','editable':false, 'formatter':audioFormatter, 'unformat': audioUnformatter}
        ],
        onSelectRow: function(rowid){
            if(rowid && rowid!==lastSel){ 
            	jQuery('#exerciceGrid').jqGrid('restoreRow', lastSel); 
            	lastSel=rowid; 
            }
            
            var exerciceId = $('#exerciceGrid').getCell(rowid, 'id');

            //API: jQuery("#exerciceGrid").jqGrid('editRow',rowid, keys, oneditfunc, succesfunc, url, extraparam, aftersavefunc,errorfunc, afterrestorefunc);
            jQuery('#exerciceGrid').jqGrid('editRow', 
            		rowid, //row id
            		true, //esc to cancel and enter to save
            		null, // "on edit" function (id)
            		null, // success function (data)
            		serverPath + '/exercice/put/', //url
            		{exercice_id: exerciceId, id: exerciceId} //extraparam send to server
            	); 
        }
    });
    
    // adding data
	$.each(batterie.exercices, function(idx, exercice){
		lastRowId = idx;
		// add exercice
    	jQuery("#exerciceGrid").jqGrid('addRowData', lastRowId, exercice);
	});
    
    // Toolbar searching
    jQuery('#exerciceGrid').jqGrid('filterToolbar',{"stringResult":true});
}
/**
 * Manage deletion
 */

function deleteFormatter(cellvalue, options, rowObject) {
	var exerciceId = cellvalue;
	return "<input class='selectExercices' type='checkbox' value='" + exerciceId + "' name='selectedExercices' title=\"Sélectionner l'exercice\">";
}

function deleteExercices(event) {
	event.preventDefault();
	event.stopPropagation();
	
	var exerciceIds = new Array();
	$.each($('input[name=selectedExercices]:checked'), function() {
		exerciceIds.push($(this).val());
	});
	
	displayConfirm("Voulez-vous supprimer ces exercices ?", function() {
		$.ajax({
			type: 'POST',
			url: serverPath + '/exercice/delete/',
			data: {ids: exerciceIds.join(',')},
			success: function() {
			    refreshBat();
			},
			error: function(data) {
				displayPopup("Cet exercice n'a pas pu être supprimé, veuillez réessayer ultérieurement.");
			},
			dataType: 'json'
		});
	});
	
	return false;
}

function deleteBat() {
	displayConfirm("Voulez-vous supprimer cette batterie et toutes ses données ?", function() {
		$.ajax({
			type: 'POST',
			url: serverPath + '/batterie/delete/',
			data: {id: batterie.id},
			success: function(data) {
				loadPanel('batteries');;
			},
			error: function(data) {
				displayPopup("Cette batterie n'a pas pu être supprimée, veuillez réessayer ultérieurement.");
			},
			dataType: 'json'
		});
	});
}

/**
 * SERIES
 */

function serieFormatter(cellvalue, options, rowObject) {
	var serieId = rowObject.serie;
	var exerciceId = rowObject.id;
	var serieName = serieId;
	if (serieNames[serieId] !== undefined) {
		serieName = serieNames[serieId].nom;			
	}
	return "<a onclick='modifySerie(" + serieId + ", event);return false;' title=\"Modifier le nom et la description de cette série\">" + serieName + "</a>";
}
function serieUnFormatter( cellvalue, options, cell){
	return '';
}

function modifySerie(serieId, event) {
	event.preventDefault();
	event.stopPropagation();
	var description = "";
	
	var serieName = serieId;
	var serieDescription = "";
	if (serieNames[serieId] !== undefined) {
		serieName = serieNames[serieId].nom;			
		serieDescription = serieNames[serieId].description;			
	}
	
	var name = prompt('Entrez le nouveau nom de la série ci-dessous. Si vous laissez ce champ vide, le numéro de la série sera utilisé.', serieName);
	if (name == null || '' == name){
		// nothing
	}else{
		var description = prompt('Entrez la description de la série (facultatif).', serieDescription);
	}
	
	$.ajax({
		type: 'POST',
		url: serverPath + '/serie/post/',
		data: {
				batterie: batterie.id,
				serie: serieId,
				nom: name,
				description: description
			},
		success: function(data) {
		    refreshBat();
		},
		error: function(error) {
			displayPopup("La série n'a pas pu être mise à jour.");
		},
		dataType: 'json'
	});
	
	return false;
}

/**
 * IMAGES
 */

function imageFormatter(cellvalue, options, rowObject) {
	var exerciceId = rowObject.id;
	var questionDir = buildPathForQuestion(batterie.id, rowObject.id);
	var img = "";
	var deleteClass = '';
	if (rowObject.has_image == '1') {
		deleteClass = ' hasItem';
		img = "<img height='50px' src='" + questionDir + cellvalue + "' alt='" + rowObject.question + "'title='" + rowObject.description + "' />";
	}
	return img + "<button onclick='modifyImage(" + options.rowId + ", event, " + exerciceId + ")' title=\"Modifier l'image\">...</button><a class='rmImage" + deleteClass + "' title=\"Supprimer l'image\" href='#' onclick='removeImage(" + options.rowId + ", event, " + exerciceId + ")'>X</a>";
}
function imageUnformatter( cellvalue, options, cell){
	return $('img', cell).attr('src');
}

function modifyImage(rowId, event, exerciceId) {
	event.preventDefault();
	event.stopPropagation();
	
	$('#modifyImageId').val(exerciceId);
	$('#modifyImageRowId').val(rowId);
	$('#modifyImageFile').trigger('click');
	
	return false;
}

function removeImage(rowId, event, exerciceId) {
	event.preventDefault();
	event.stopPropagation();
	
	$.ajax({
		type: 'POST',
		url: serverPath + '/exercice/removeImage/',
		data: {exercice_id: exerciceId},
		success: function() {
			$('#exerciceGrid #' + rowId + ' .imageColumn a').removeClass('hasItem');
			$('#exerciceGrid #' + rowId + ' .imageColumn img').remove();
		},
		error: function(data) {
			displayPopup("Cette image n'a pas pu être supprimée, veuillez réessayer ultérieurement.");
		},
		dataType: 'json'
	});
	
	return false;
}

function sendModifiedImage() {
	$('form.modifyImage').submit();
	
	return false;
}

function exerciceImagePostSuccess (rowId, src) {
	resetImageFile();
	var img = $('#exerciceGrid #' + rowId + ' .imageColumn img');
	$('#exerciceGrid #' + rowId + ' .imageColumn a').addClass('hasItem');
	if (img.length > 0) {
		img.attr('src', src);
	}else{
		$('#exerciceGrid #' + rowId + ' .imageColumn').prepend("<img height='50px' src='" + src + "' />");
	}
}
function exerciceImagePostFailure (error) {
	resetImageFile();
	if (error == "file_missed") {
		displayPopup('Aucun fichier sélectionné.');
	} else if (error == "exercice_missed") {
		displayPopup('L\'exercice n\'existe pas.');
	} else if (error == "wrong_image") {
		displayPopup('Le fichier n\'est pas une image, ou bien cette image est trop grande.');
	} else if (error == "upload_failed") {
		displayPopup('Le fichier n\a pas pu être ajouté');
	} else {
		displayPopup('Erreur inconnue');
	}
}

function resetImageFile() {
	$('#modifyImageFile').unbind('change');
	$('#modifyImageFile').val('');
	$('#modifyImageFile').bind('change', sendModifiedImage);
}

/**
 * AUDIO
 */

function audioFormatter(cellvalue, options, rowObject) {
	var exerciceId = rowObject.id;
	var questionDir = buildPathForQuestion(batterie.id, rowObject.id);
	var audioObj = '';
	var deleteClass = '';
	if (rowObject.has_sound == '1') {
		deleteClass = ' hasItem';
		audioObj =  "<audio id='player_" +  questionDir + "' class='audio'" + 
					"' alt='" + rowObject.question + "'title='" + rowObject.description + 
					"' src='" + questionDir + cellvalue + 
					"' type='audio/mp3'/>" + 
						"<div class='aButtonContainer'>" +
							"<button onclick=\"document.getElementById('player_" +  questionDir + "').play()\" title='play'>&gt;</button>" +
							"<button onclick=\"document.getElementById('player_" +  questionDir + "').pause()\" title='pause'>||</button>" +
						"</div>" +
					"</audio>";
	}
	
	return audioObj + "<button onclick='modifyAudio(" + options.rowId + ", event, " + exerciceId + ")' title='Modifier le son'>...</button><a class='rmAudio" + deleteClass + "' title=\"Supprimer le son\" href='#' onclick='removeSound(" + options.rowId + ", event, " + exerciceId + ")'>X</a>";
}
function audioUnformatter( cellvalue, options, cell){
	return $('source', cell).attr('src');
}

function modifyAudio(rowId, event, exerciceId) {
	event.preventDefault();
	event.stopPropagation();
	
	$('#modifyAudioId').val(exerciceId);
	$('#modifyAudioRowId').val(rowId);
	$('#modifyAudioFile').trigger('click');
	
	return false;
}

function removeSound(rowId, event, exerciceId) {
	event.preventDefault();
	event.stopPropagation();
	
	$.ajax({
		type: 'POST',
		url: serverPath + '/exercice/removeAudio/',
		data: {exercice_id: exerciceId},
		success: function() {
			$('#exerciceGrid #' + rowId + ' .audioColumn a').removeClass('hasItem');
			$('#exerciceGrid #' + rowId + ' .audioColumn audio').remove();
			$('#exerciceGrid #' + rowId + ' .audioColumn .aButtonContainer').remove();
		},
		error: function(data) {
			displayPopup("Ce son n'a pas pu être supprimé, veuillez réessayer ultérieurement.");
		},
		dataType: 'json'
	});
	
	return false;
}

function sendModifiedAudio() {
	$('form.modifyAudio').submit();
	
	return false;
}

function exerciceAudioPostSuccess (rowId, src) {
	resetAudioFile();
	var audio = $('#exerciceGrid #' + rowId + ' .audioColumn audio');
	$('#exerciceGrid #' + rowId + ' .audioColumn a').addClass('hasItem');
	if (audio.length > 0) {
		audio.attr('src', src);
	}else{
		$('#exerciceGrid #' + rowId + ' .audioColumn').prepend(
			"<audio id='player_new_" +  rowId + "' class='audio'" + 
			"' src='" + src + 
			"' type='audio/mp3'/>" + 
				"<div class='aButtonContainer'>" +
					"<button onclick=\"document.getElementById('player_new_" +  rowId + "').play()\" title='play'>&gt;</button>" +
					"<button onclick=\"document.getElementById('player_new_" +  rowId + "').pause()\" title='pause'>||</button>" +
				"</div>" +
			"</audio>"
		);
	}
}
function exerciceAudioPostFailure (error) {
	resetAudioFile();
	if (error == "file_missed") {
		displayPopup('Aucun fichier sélectionné.');
	} else if (error == "exercice_missed") {
		displayPopup('L\'exercice n\'existe pas.');
	} else if (error == "wrong_sound") {
		displayPopup('Le fichier n\'est pas un son, ou bien ce son est trop volumineux.');
	} else if (error == "upload_failed") {
		displayPopup('Le fichier n\a pas pu être ajouté');
	} else {
		displayPopup('Erreur inconnue');
	}
}

function resetAudioFile() {
	$('#modifyAudioFile').unbind('change');
	$('#modifyAudioFile').val('');
	$('#modifyAudioFile').bind('change', sendModifiedAudio);
}

/**
 * CSV FORM
 */

function toggleCsvForm() {
	if ($('.batterieForm .cvsForm').hasClass('hidden')) {
		displayCsvForm();
	} else {
		hideCsvForm();
	}
}

function hideCsvForm() {
	$('.batterieForm .cvsForm').addClass('hidden');
}

function displayCsvForm() {
	$('.batterieForm .cvsForm').removeClass('hidden');
}

function exerciceCsvPostSuccess () {
	displayPopup('Les exercices ont bien été ajoutés.', 'Exercices ajoutés');
    refreshBat();
}
function exerciceCsvPostFailure (error) {
	if (error == "batterie_missed") {
		displayPopup('Cette batterie n\'existe pas');
	} else if (error == "wrong_csv") {
		displayPopup('Le fichier chargé est mal formé');
	} else if (error == "creation_failed") {
		displayPopup('Les exercices n\'ont pas été ajoutés');
	} else {
		displayPopup('Erreur inconnue');
	}
}

function displayCsvHelp () {
	displayPopup(
			"Afin de charger plusieurs enregistrements à la fois, vous pouvez télécharger un fichier au format CSV. Il s'agit simplement d'un fichier texte dont chaque ligne représente un enregistrement. Au sein de chaque ligne vous devez inscrire la description, puis la réponse complète, puis la question (chacun séparé par un point-virgule), comme dans l'exemple suivant : <br>\n"+
			"<br>\n" + 
			"description 1;réponse complète 1;question 1<br>\n" + 
			"description 2;réponse complète 2;question 2<br>\n" + 
			"description 3;réponse complète 3;question 3<br>\n" + 
			"etc.<br>\n" + 
			"<br>\n" + 
			"Vous noterez que ce format vous empêche d'utiliser le point-virgule dans n'importe lequel des 3 champs.",
			
			"Fonctionnement des fichiers CSV"
		);
}

/**
 * REFRESH
 */

function refreshBat () {
	displayBatterieForm(batterie.id);
}

/**
 * MAIN DATA
 */

function saveMainData () {
	var data =  $('.batterieForm form#mainData').serialize();
	$.each($('.batterieForm form#mainData input[type=checkbox]:not(:checked)'), function(idx, cb){
		data += '&' + $(cb).attr('name') + '=0';
	});

	$.ajax({
		type: 'POST',
		url: serverPath + '/batterie/put/',
		data: data,
		success: function() {
		    refreshBat();
		},
		error: function(data) {
			displayPopup("Les informations de la batterie n'ont pas été correctement mises à jour.");
		},
		dataType: 'json'
	});
	return false;
}

/**
 * NEW EXERCICE
 */

function postNewExercice () {
	$.ajax({
		type: 'POST',
		url: serverPath + '/exercice/post/',
		data: $('.batterieForm form.newExercice').serialize(),
		success: function(exercice) {
			jQuery("#exerciceGrid").jqGrid('addRowData', ++lastRowId, exercice);
			$('.batterieForm form.newExercice .field.inp input').val('');
		},
		error: function(data) {
			displayPopup("L'exercice n'a pas pu être ajouté.");
		},
		dataType: 'json'
	});
	return false;
}
